﻿@using hc.epm.DataModel.Business
@model IEnumerable<Epm_ProjectData>
@{
    ViewBag.Title = @ViewBag.Title;
    Layout = "~/Views/Shared/_LayoutDialog.cshtml";
}
<link href="~/Resource/plugins/layui-2.1.2/css/layui.css" rel="stylesheet" />
<link href="~/Resource/plugins/layui-2.1.2/css/modules/layer/default/layer.css" rel="stylesheet" />

<style>
    .tablecontainer {
        width: 100%;
        height: auto;
    }

    .data {
        float: left;
        width: 80px;
    }

    .tablecontainer {
        float: left;
    }
</style>
<div class="tablelist">
    @*<div class="data"><label><span class="star">*</span>&nbsp;项目资料&nbsp;:</label></div>*@
    <div class="tablecontainer">
        <table class="datalist">
            <thead>
                <tr>
                    <th>序号</th>
                    <th>资料编码</th>
                    <th>资料名称</th>
                    <th>是否必填</th>
                    <th>附件名称</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody>
                @{
                    int cout = 0;
                }
                @if (Model.Count() > 0)
                {
                    foreach (var item in Model)
                    {
                        cout++;
                <tr>
                    <td> @cout </td>
                    <td>@item.FileCode</td>
                    <td><span id="fileName_@item.Id">@item.FileName</span></td>
                    <td>@(item.IsRequire == true ? "是" : "否")</td>
                    <td><span id="file_@item.Id">@item.Remark</span></td>
                    <td><span id="prc_@item.Id">@(item.State == 1 ? "已上传" : "未上传")</span></td>
                    <td>
                        <input type="hidden" id="jsonFile_@item.Id" /><a href="javascript:void(0);" class="btnUpload" id="btnUploadFile_@item.Id">上传</a>
                        <a href="javascript:void(0);" class="btnSave" onclick="SaveFile('file_@item.Id','fileName_@item.Id','jsonFile_@item.Id')" id="btnSave_@item.Id">保存</a>
                    </td>
                </tr>
                    }
                }
                else {
                <tr>
                    <td colspan="8">暂无数据</td>
                </tr>
                }
            </tbody>
        </table>
    </div>
</div>
<script src="~/Resource/scripts/jquery-1.10.2.js"></script>

<!--upload start-->
<script src="~/Resource/scripts/global.js" type="text/javascript"></script>
<script src="~/Resource/scripts/comm.js"></script>
<script type="text/javascript" src="~/Resource/plugins/layui-2.1.2/layui.js"></script>
<script src="~/Resource/scripts/plupload_2_1_2/moxie.min.js" type="text/javascript"></script>
<script src="~/Resource/scripts/plupload_2_1_2/plupload.dev.js" type="text/javascript"></script>
<script src="~/Resource/scripts/plupload_2_1_2/zh_CN.js" type="text/javascript" charset="UTF-8"></script>
<script src="~/Resource/plugins/layui-2.1.2/lay/modules/element.js" type="text/javascript"></script>
<script src="~/Resource/plugins/layui-2.1.2/lay/modules/layer.js"></script>
<!--upload end-->
<script>
    $(function () {
        //上传
        $(".btnUpload").each(function () {
            var fileId = $(this).parent().prev().prev().find("span:first").attr("id");
            var prcId = $(this).parent().prev().find("span:first").attr("id");
            var jsonfileId = $(this).prev().attr("id");
            Upload($(this).attr("id"), fileId, prcId, jsonfileId);
        });
    });
    //附件上传
    var fileDataArrayFile = [];
    var fileDataJsonFile = [];
    function Upload(btnName, spanFile, spanPrec, spanJson) {
        //上传附件
        var uploaderFile = new plupload.Uploader({
            runtimes: 'html5,flash,silverlight,html4', // 这里是说用什么技术引擎
            url: FileServerURL, // 服务端上传路径
            max_file_size: MaxFileSize, // 文件上传最大限制。
            max_file_count: 10, //指示用户可以同时上传文件的最大数量
            chunk_size: 0, // 上传分块每块的大小，这个值小于服务器最大上传限制的值即可,0表示不启用分块。
            browse_button: btnName,//触发上传元素
            flash_swf_url: '/Resource/scripts/plupload_2_1_2/Moxie.swf',
            silverlight_xap_url: '/Resource/scripts/plupload_2_1_2/Moxie.xap',
            multi_selection: false,//	是否可以在文件浏览对话框中选择多个文件
            multipart_params: {//附加参数
                app: 'epm',
                crop: true
            },
            //  这个数组是选择器，就是上传文件时限制的上传文件类型，在chrome下有bug，要等待
            filters: {
                mime_types: [
                    { title: "Doc files", extensions: "doc,docx,xls,xlsx,rar,zip,7z,gif,rmvb,mp4,avi,jpg,png,jpeg" },
                ],
                max_file_size: MaxFileSize, //最大只能上传100mb的文件
                prevent_duplicates: true //不允许选取重复文件
            },
            rename: false, // 是否重命名文件
            init: {
                PostInit: function () { },
                FilesAdded: function (uploaderFile, files) {
                    if (files) {
                        files.forEach(function (item, index, arr) {
                            $("#" + spanFile).text(item.name);
                        })
                        fileDataArrayFile = [];
                        fileDataJsonFile = [];
                        uploaderFile.start();
                    }
                },
                UploadProgress: function (uploaderFile, file) {
                    $("#" + spanPrec).text(file.percent + "%");
                },
                FileUploaded: function (uploaderFile, file, responseObject) {
                    var data = JSON.parse(responseObject.response);
                    data.file.forEach(function (item, index, arr) {
                        var obj = {};
                        obj.GuidId = file.id;
                        obj.Name = item.Name;
                        obj.Size = item.FileSize;
                        obj.FileGuid = item.Guid;
                        obj.Url = item.VirtualURL;
                        if (IsImage(item.Extension)) {
                            obj.ImageType = getImageType(item.Name, item.Extension);
                        }
                        fileDataArrayFile.push(obj);
                    })
                    //var img = '<img src="/Resource/images/default_ok.png" alt="完成" />'
                    //$("#" + file.id).find(".fileComplete").html(img);
                    //$("#" + file.id).find("a").prop("href", FileDownLoadURL + data.file[0].Guid)
                    uploaderFile.removeFile(file);

                },
                UploadComplete: function (uploaderFile, file, responseObject) {
                    fileDataJsonFile = JSON.stringify(fileDataArrayFile);
                    $("#" + spanJson).val(fileDataJsonFile);
                    $("#" + spanPrec).text("已上传");
                },
                Error: function (up, err) {
                    layer.alert("错误：" + err.code + ": " + err.message);
                }
            },

        });
        uploaderFile.init();
        //删除附件
        $("#fileListFile").on("click", ".fileDel", function () {
            $(this).parents("li").remove();
            var toremove = '';
            var id = $(this).data("val");
            //----删除初始文件对应的值
            fileDataArrayFile = fileDataArrayFile.filter(function (item, index, arr) {
                return item.GuidId != id
            })
            fileDataJsonFile = JSON.stringify(fileDataArrayFile);
            $("#fileDataJsonFile").val(fileDataJsonFile);
        });
    }

    //保存上传文件
        function SaveFile(spanFile, spanFileName, spanJson) {
            var name = $("#" + spanFile).text();//文件名称
            var projectId = $("#ProjectId").val();  //项目ID
            var projectName = $("#ProjectName").val();  //项目名称
            var fileName = $("#" + spanFileName).text();//项目资料名称
            var fileId = spanFileName.split('_')[1];  //项目资料ID

            var fileJson = $("#" + spanJson).val();
            layui.use('layer', function () {
                var layer = layui.layer;
            if (fileJson.length <= 0) {
                layer.alert("请先上传资料！", { icon: 2 });
            } else {
                $.ajax({
                    url: "/Project/SaveFile",
                    type: "Post",
                    data: {
                        name: name,
                        projectId: projectId,
                        projectName: projectName,
                        fileName: fileName,
                        fileId: fileId,
                        fileJson: fileJson
                    },
                    dataType: "json",
                    success: function (result) {
                        if (result) {
                            layer.alert("保存成功", { icon: 1 });
                        } else {
                            layer.alert("保存失败!", { icon: 2 });
                        }
                    }
                });
            }
            });
        }

</script>
